<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>	
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path;
%>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>我的活动</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="<%=basePath %>/css/open/mp/common.css" type="text/css">
<link rel="stylesheet" href="<%=basePath %>/css/open/mp/activity.css?v=2018031504" type="text/css">
<style type="text/css">
.list{
	display: none;
}
.curlist{
	display: block;
}
</style>
</head>
<body>
	<div id="container">
        <div class="tab">
            <div class="cur" data-type='now'>进行中活动</div><!--
    		--><div data-type='history'>历史参与</div>
        </div>
        <div class="activitys">
        	<div class="list curlist" id="alllist"></div>
        	<div class="list" id="joinlist"></div>
        </div>
    </div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script type="text/javascript">
function loadData(){
	var baseInfoUrl = '${pageContext.request.contextPath}/open/me/activityList';
	$.ajax({
		url:baseInfoUrl,
		type:"GET",
		timeout: 2000,
		success:function (result) {
			if(result.status == 200){
				console.log(result.data)
				console.log(result.data.allActivity)
				for(j = 0; j < result.data.allActivity.length; j++) {
					var act = result.data.allActivity[j];
					var itemHtml = '<div class="activity">';
					itemHtml += '<a href="'+act.web_url+'">';
					itemHtml += '<img src="'+act.head_pic+'" onerror="javascript:this.src=\'${pageContext.request.contextPath}/images/open/mp/logo_black.png\';this.onerror=null"/>';
					itemHtml += '<div class="item-text">';
					itemHtml += '<div class="title">'+act.name+'</div>';
					itemHtml += '<div class="desc">'+act.content+'</div>';
					if(act.end_time=="" || act.end_time==null){
                        itemHtml += '<div class="date">有效期至：不限</div>';
                    }else{
                        itemHtml += '<div class="date">有效期至：'+act.end_time+'</div>';
                    }

					itemHtml += '</div>';
					itemHtml += '</a>';
					itemHtml += '</div>';
					$('#alllist').append(itemHtml);
				}
				for(j = 0; j < result.data.joinAcivitiy.length; j++) {
					var act = result.data.joinAcivitiy[j];
					var itemHtml = '<div class="activity">';
					itemHtml += '<a href="'+act.web_url+'">';
					itemHtml += '<img src="'+act.head_pic+'" onerror="javascript:this.src=\'${pageContext.request.contextPath}/images/open/mp/logo_black.png\';this.onerror=null"/>';
					itemHtml += '<div class="item-text">';
					itemHtml += '<div class="title">'+act.name+'</div>';
					itemHtml += '<div class="desc">'+act.content+'</div>';
                    if(act.end_time=="" || act.end_time==null){
                        itemHtml += '<div class="date">有效期至：不限</div>';
                    }else{
                        itemHtml += '<div class="date">有效期至：'+act.end_time+'</div>';
                    }
					itemHtml += '</div>';
					itemHtml += '</a>';
					itemHtml += '</div>';
					$('#joinlist').append(itemHtml);
				}
			}else{
				//alert(result.msg);
			}
		},
		error:function(result){
			/* alert("3.服务器异常"); */
		}
	})
}
$(function(){
	$('.tab div').on('click',function(){
		var type = $(this).data('type');
		$('.tab>div').toggleClass('cur')
		$('.activitys>div').toggleClass('curlist')
	})
	loadData();
})
</script>
</body>
</html>